import styled from 'styled-components'

export const UserProfileWrapper = styled.div`
  box-sizing: border-box;
  border-radius: 5px;
  margin-top: 20px;
  padding: 40px;
  p.line {
    margin-top: 30px;
  }
  .nickname {
    text-align: center;
    font-size: 30px;
    margin-bottom: 20px;
  }
  .table-title {
    color: #008c8c;
    margin-bottom: 20px;
  }
  .detail-table {
    width: 100%;
    thead {
      display: none;
    }
    tbody {
      tr {
        width: 100%;
        border-bottom: 1px solid #eaeaea;
        :nth-of-type(odd) {
          background-color: rgba(221, 221, 221, 0.5);
        }
        :hover {
          background-color: rgba(221, 221, 221, 0.9);
          cursor: pointer;
        }
        td:first-child {
          width: 130px;
          font-weight: 700;
          color: #2b76b4;
        }
        td {
          text-align: left;
          font-weight: 400;
          vertical-align: middle;
          border-bottom-width: 1px;
          border-right: 1px solid #eee;
          padding: 10px;
          box-sizing: border-box;
        }
      }
    }
  }
`
